//  表单提交
$('#addUserForm').on('submit', function() {
 
  let formData = $(this).serialize()
  $.ajax({
    type: 'post',
    url: '/users',
    data: formData,
    success: function(response) {
      location.reload()
    },
    error: function(response) {
      let res = JSON.parse(response.responseText)
      alert(res.message)
      
    }
  })
  return false
})
//  邮箱格式验证
$('#userEmail').on('blur',function() {
  let userEmail = $('#userEmail').val()
  let reg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
  if (!reg.test(userEmail)) {
    alert('请输入正确格式的邮箱')
  }
})
//  头像文件上传
$('.addUser').on('change',"#avatarInput", function() {
    let formData = new FormData()
    formData.append('avatar', this.files[0])
    $.ajax({
      type: 'post',
      url: '/upload',
      data: formData,
      // 告诉ajax不要解析参数
      processData: false,
      contentType: false,
      success: function(response) {
        $('#preview').attr('src',response[0].avatar)
        $('#inputHidden').val(response[0].avatar)
      }
    })
})
//  获取用户数据
$.ajax({
  type: 'get',
  url: '/users',
  success: function(response) {
   let html = template("userTpl", {data: response})
   $('.userTable tbody').html(html)
  }
})
//  用户编辑
$('.userTable').on('click',"#userModify", function() {
  let id = $(this).attr('data-id')
  $.ajax({
    type:'get',
    url: '/users/'+ id,
    success: function(response) {
      let html = template('userModifyTpl',response)
      $('.addUser').html(html)
    }
  })
})
//  用户修改提交
$('.addUser').on('submit', '#addUserForm', function() {
  let id = $(this).attr('data-id')
  let formData = $(this).serialize()
  $.ajax({
    type: 'put',
    url: '/users/'+ id,
    data: formData,
    success: function(response) {
      location.reload()
    },
    error: function(res) {
      alert('修改失败')
    }
  })
  return false
})
//  用户删除
$('.userTable').on('click','.deleteUser', function() {
  let id = $(this).attr('data-id')
  if(confirm('你确定进行删除操作吗')) {
    $.ajax({
      type: 'delete',
      url: '/users/'+ id,
      success: function(response) {
        location.reload()
      },
      error: function() {
        alert('删除失败')
      }
    })
  }
})
//  点击全选
$('.userTable').on('change','.selectAll', function() {
  $('.select').prop('checked', $(this).prop('checked'))
  // 调用盒子显示隐藏的函数
  if (!$(this).prop('checked')) {
    $('.page-action').hide()
  }else {
    $('.page-action').show()
  }
})
$('.userTable').on('change','.select', function() {
  let item =  $('.select').filter(function(index, el) {
     return $(el).prop('checked') == true
   })
   if(item.length > 0) {
    $('.page-action').show()
   }else {
    $('.page-action').hide()
   }
   if(item.length == $('.select').length){
    $('.selectAll').prop('checked', true)
   }else {
    $('.selectAll').prop('checked', false)
   }
  })
  //  批量删除的点击事件
  $('.deleteMany').on('click', function() {
    if(confirm('你确定进行删除操作吗')) {
      let arr = []
      $('.userTable tbody').find('input').filter(':checked').each(function(i,val) {
        arr.push($(val).attr('data-id'))
      })
      let str = arr.join('-')
     $.ajax({
       type: 'delete',
       url: '/users/'+ str,
       success: function(response) {
        location.reload()
       },
       error: function() {
         alert('删除失败')
       }
     })
    }
   
  })
  
